<template>
	<view class="all">
		<Head class='HeadList'></Head>
		<view class="ListOfPatients">
			<view class="ListOfPatients_All">
				<view class="ListOfPatients_TP">
					<view class="inputCsF">
						{{value}}
					</view>
					<view class="inputCsF">
						{{value1}}
					</view>
					<Select class="selectCla" :disabled="false" v-model="examinationTypeIndex" :options="options"
						:shows="true" @change="change"></Select>
				</view>
				<view class="ListOfPatients_BT">
					<scroll-view style="height: 100%;" scroll-y="true" :scroll-top="scrollTop" @scroll="scroll">
						<view class="ListOfPatientsBT_item" v-for="(item,index) in list" :key="index"
							style="margin-bottom: 10px;">
							<view class=""
								style="display: flex;justify-content: space-between;align-items: center;padding: 0 5px;">
								<view class="" style="style='width: 32px; height: 20px;'">
									<u-input :value="item.many + '.0'" :disabled="true"></u-input>
								</view>
								<view class="ListOfPatientsBTItem_text">
									{{((item.fee + '').indexOf('.') != -1 ) ? item.fee: item.fee.toFixed(1)}}
								</view>
								<view class="ListOfPatientsBTItem_textT">
									{{((item.feez + '').indexOf('.') != -1 ) ? item.feez: item.feez.toFixed(1)}}
								</view>
								<view class="ListOfPatientsBTItem_Right">
									{{item.fdate}}
								</view>
								<view class="Iage"></view>
							</view>
							<view class="ListOfPatientsBT_centerDiv">
								<view class="ListOfPatientsBT_center">
									{{item.remark}}
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</view>
		<suspension-ball :isShow="false" @tap.native="jampBall"></suspension-ball>
	</view>
</template>

<script>
	import Select from './selevt.vue'
	import Head from '../../components/html/head.vue'
	import suspensionBall from '../../components/html/xuanfuqiu.vue'
	import {
		FeiYongChaXun
	} from '../../api/user.js'
	import {
		mapMutations,
		mapState
	} from "vuex";
	export default {
		components: {
			Select,
			Head,
			suspensionBall
		},
		data() {
			return {
				form: {
					name: '',
				},
				examinationTypeIndex: 1,
				select: '',
				value: new Date().toISOString().slice(0, 10), //现在时间,
				value1: new Date().toISOString().slice(0, 10), //现在时间,
				options: [{
					value: "1",
					label: "全部"
				}, {
					value: "2",
					label: "药物"
				}, {
					value: "3",
					label: "材治护",
					// disabled: true
				}],
				list: [],
				headkey: 0,
				scrollTop: 0,
			};
		},
		watch: {
			deleteObj: {
				// deep: true,
				handler(newval,oldval) {
					if(newval.MRN != oldval.MRN){
						this.FeiYongChaXunFun()
					}
				},
			}
		},
		computed: {
			...mapState('user', ['userInfo', 'deleteObj'])
		},
		mounted() {
			this.FeiYongChaXunFun();
		},
		methods: {
			jampBall() {
			uni.navigateBack({
				delta: 1, //返回层数，2则上上页
			})
			},
			change(e) {
				this.examinationTypeIndex = e
				this.FeiYongChaXunFun()
			},
			scroll(e) {
				//记录scroll  位置
				this.oldScrollTop = e.detail.scrollTop
			},
			async FeiYongChaXunFun() {
				try {
					this.scrollTop = this.oldScrollTop
					//当视图渲染结束 重新设置为0
					this.$nextTick(() => {
						this.scrollTop = 0
					});
					uni.showLoading({
						title: '加载中...', //显示的文字
						duration: 5000, //显示多少时间，默认1500毫秒
						icon: "loading", //自定义显示的图标，默认成功success，错误error,加载loading，不显示图标是none
						mask: true
					})
					const user = uni.getStorageSync('userInfo')
					const obj = uni.getStorageSync('deleteObj')
					const data = {
						HosKind: user.hoscode,
						mrn: obj.MRN,
						series: obj.SERIES,
						startdate: this.value,
						enddate: this.value,
						kind: this.examinationTypeIndex == 1 ? '全部' : this.examinationTypeIndex == 2 ? '药物' :
							'材治护',
						sOperdept: user.HosKind,
						sOperJp: user.sPassword
					}
					const res = await this.$http.FeiYongChaXun(data)
					if (res) {
						this.list = res
						this.$nextTick(() => {
							setTimeout(() => {
								uni.hideLoading();
							}, 2000);
						})
					}
				} catch (e) {
					//TODO handle the exception
					console.log(e);
				}
			}
		}
	};
</script>

<style scoped lang="scss">
	.all {
		width: 100%;
		height: 100vh;
		overflow: hidden;
	}

	.HeadList {
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99;
	}

	.ListOfPatients {
		background: #F9F9F9;
		height: calc(100% - 102px);
		padding: 0 10px;
		margin-top: 113px;

		.ListOfPatients_All {
			background: #F9F9F9;
			width: 100%;
			height: 100%;
			// position: absolute;
			// top: 0;
			// left: 0;
		}

		.ListOfPatients_TP {
			margin: 10px 0px;
			display: flex;
			justify-content: space-between;
			width: 100%;

			.inputCsF {
				width: 31.3%;
				height: 34px;
				border: 1px solid #B3E7EA;
				text-align: center;
				line-height: 34px;
			}

			.inputCs {
				width: 100%;
				height: 100%;
				background: #FFFFFF;
				border-radius: 6px;
				padding: 0 0 !important;
			}

			.selectCla {
				width: 33.3%;
				height: 36px;
			}

			::v-deep.u-border {
				border: 1px solid #B3E7EA;
				border-color: #B3E7EA !important;
			}

			.custom-style {
				width: 84px;
				height: 36px;
				background: #82ECC3;
				box-shadow: 0px 2px 6px 0px rgba(98, 200, 160, 0.5);
				border-radius: 6px;
				color: #FFFFFF;
				font-size: 16px;
				margin: 0 0;
			}

			.select_btn {
				display: flex;

				.custom-styleTwo {
					width: 52px;
					height: 36px;
					background: #82ECC3;
					box-shadow: 0px 2px 6px 0px rgba(98, 200, 160, 0.5);
					border-radius: 6px 0px 0px 6px;
					color: #FFFFFF;
					font-size: 16px;
					margin: 0 0;
				}
			}

			.inputCsF {
				::v-deep .u-input__content {
					padding: 0 10px !important;
				}
			}
		}

		.ListOfPatients_BT {
			width: 100%;
			height: calc(100% - 65px);
			overflow-y: scroll;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;

			.ListOfPatientsBT_item {
				width: 100%;
				// height: 100px;
				// min-height: 94px;
				background: #B0E9EC;
				border-radius: 6px;
				// padding-bottom: 17px;
				position: relative;
				// padding-bottom: 15px;


				.ListOfPatientsBTItem_text {
					font-size: 16px;
					font-family: SourceHanSansCN-Medium, SourceHanSansCN;
					font-weight: 500;
					color: #FF4D65;
					line-height: 24px;
				}

				.ListOfPatientsBTItem_textT {
					font-size: 16px;
					font-family: SourceHanSansCN-Medium, SourceHanSansCN;
					font-weight: 500;
					color: #333333;
					line-height: 24px;
				}

				.ListOfPatientsBTItem_Right {
					width: 164px;
					height: 30px;
					// background: #FFFFCF ;
					// border-bottom-left-radius: 404rpx;
					// background-image: url("../../assets/image/sjd.png");
					// background-size: 104% 115%;
					// background-repeat: no-repeat;
					text-align: right;
					line-height: 30px;
					z-index: 1;
				}

				.Iage {
					width: 210px !important;
					height: 34px !important;
					position: absolute;
					top: 0;
					right: 0;
					background: url('../../assets/image/sjd.png') no-repeat 28px 0;
					background-size: 100% 100%;
				}
			}

			.ListOfPatientsBT_centerDiv {
				padding: 5px 5px;
			}

			.ListOfPatientsBT_center {
				// min-height: 63px;
				padding: 10px;
				background: #F6FEFF;
				border-radius: 6px;
				opacity: 0.95;
				// margin: 6px 5px;
			}

			::v-deep .u-input {
				padding: 0 0 !important;
				width: 36px !important;
				height: 22px !important;
			}

			::v-deep .uni-input-input {
				background: #CAF0F3 !important;
				border-radius: 2px !important;
				border: 2px solid #7AD9DF !important;
			}

			::v-deep .uni-input-input {
				width: 89% !important;
				height: 18px !important;
			}
		}

	}

	::v-deep .u-form-item__body__right__content__slot {
		justify-content: space-between;
	}

	::v-deep .u-form-item__body {
		padding: 0px 5px;
		// margin-bottom: 15px;
	}

	::v-deep .u-border {
		border: none;
		background: #F6FEFF;
	}

	::v-deep .u-checkbox__icon-wrap--square {
		background: #CAF0F3 !important;
		border-radius: 2px !important;
		border: 2px solid #7AD9DF !important;
	}

	::v-deep .Iage div {
		background-size: auto !important;
		background-position: 100% 0% !important;
	}
</style>
